<template>
  <div class="xgt">
    <Form
        class="form-container"
        :label-width="80"
        ref="condition"
        :model="condition"
        inline>
      <div class="form-left-block">
        <FormItem prop="source" label="数据来源：">
          <Select v-model="condition.source" class="w162">
            <Option v-for="item in config.source" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
        </FormItem>
        <FormItem prop="visible" label="显示状态：" :label-width="75">
          <Select v-model="condition.visible" class="w162">
            <Option v-for="item in config.visible" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
        </FormItem>
        <FormItem prop="spaceTag" label="空间："  :label-width="50">
          <template v-if="condition.category==1||condition.category==-1">
            <Select
                v-model="condition.spaceTag"
                @on-change="zoneChange(condition.spaceTag, 1);"
                class="w162">
              <Option
                  v-for="item in config.spaceTagAll"
                  :value="item.oneWholeCode"
                  :key="item.oneWholeCode"
              >{{ item.oneLevelName }}
              </Option>
            </Select>
          </template>
          <template v-else-if="condition.category==2">
            <Select
                v-model="condition.spaceTag"
                @on-change="zoneChange(condition.spaceTag, 2);"
                class="w162">
              <Option
                  v-for="item in config.publicZone"
                  :value="item.id"
                  :key="item.id+20"
              >{{ item.title }}
              </Option>
            </Select>
          </template>
        </FormItem>
        <transition name="fade">
        <span v-show="expand">
          <FormItem
              prop="spaceSubTag"
              label="空间二级"
              v-if="config.subSpaceTag !== undefined && config.subSpaceTag.length > 0"
              class="w162">
        <template v-if="condition.category==1||condition.category==-1">
          <Select
              v-if="config.subSpaceTag !== undefined && config.subSpaceTag.length > 0"
              v-model="condition.subSpaceTag"
              class="w162">
            <Option
                v-for="itemTag in config.subSpaceTag"
                :value="itemTag.twoWholeCode"
                :key="itemTag.twoWholeCode"
            >{{ itemTag.twoLevelName }}</Option>
          </Select>
        </template>
      </FormItem>
          <FormItem prop="comment_app" label="推荐状态：">
            <Select v-model="condition.comment_app" class="w162">
          <Option v-for="item in config.comment_app" :value="item.id" :key="item.id">
            {{ item.title }}
          </Option>
        </Select>
          </FormItem>
          <FormItem prop="category" label="装修类型：">
            <Select
                v-model="condition.category"
                @on-change="categoryChange(condition.category);"
                class="w162">
            <Option v-for="item in config.category" :value="item.id" :key="item.id">{{ item.title }}</Option>
            </Select>
         </FormItem>
          <FormItem prop="oareaTag" label="装修面积：">
            <Select v-model="condition.oareaTag" class="w162">
          <Option v-for="item in config.oareaType" :value="item.id" :key="item.id">{{ item.title }}</Option>
        </Select>
         </FormItem>
         <FormItem prop="styleTag" label="风格：" :label-width="50">
          <Select v-model="condition.styleTag" class="w162">
          <Option v-for="item in config.styleid" :value="item.id" :key="item.id">{{ item.title }}</Option>
        </Select>
         </FormItem>
        <FormItem prop="showOne" label="显示："  :label-width="50">
          <Select v-model="condition.showOne" :disabled="showOneReadOnly" class="w162">
          <Option v-for="item in config.showOne" :value="item.id" :key="item.id">{{ item.title }}</Option>
        </Select>
        </FormItem>
        <FormItem prop="houseTag" label="户型："  :label-width="50">
        <template v-if="condition.category==1||condition.category==-1">
          <Select v-model="condition.houseTag" class="w162">
            <Option v-for="item in config.hxconfig" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
        </template>
        <template v-else-if="condition.category==2">
          <Select v-model="condition.houseTag" class="w162">
            <Option v-for="item in config.hxconfig" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
        </template>
      </FormItem>
        <FormItem prop="isRepeat" label="是否重复：">
        <Select v-model="condition.isRepeat" class="w162">
          <Option :value="-1" :key="-1">全部</Option>
          <Option :value="1" :key="1">是</Option>
        </Select>
      </FormItem>
      <FormItem prop="queryType" label-width="85" label="自定义查询：">
        <Input type="text" v-model="condition.customerValue">
            <Select
                slot="prepend"
                v-model="condition.queryType"
                style="width: 95px;">
             <Option v-for="item in config.queryType" :value="item.id" :key="item.id">{{ item.title }}</Option>
           </Select>
        </Input>
      </FormItem>
      <FormItem prop="timeType" label="时间筛选：">
        <Select v-model="condition.timeType" label="时间类型" style="width:200px">
          <Option v-for="item in config.timeType" :value="item.id" :key="item.id">{{ item.title }}</Option>
        </Select>
      </FormItem>
      <FormItem prop="startTime" label-width="1">
        <DatePicker
            type="datetime"
            v-model="condition.startTime"
            @on-change="(dateTime) => {  handlerTime(dateTime,'startTime')}"
        ></DatePicker>
        <span style="margin-left: 8px;">至</span>
      </FormItem>
      <FormItem prop="endTime" label-width="1">
        <DatePicker
            type="datetime"
            v-model="condition.endTime"
            @on-change="(dateTime) => {  handlerTime(dateTime,'endTime')}"
        ></DatePicker>
      </FormItem>
     </span>
        </transition>
      </div>
      <div class="form-right-block">
          <span class="toggle-btn" v-if="true" @click="toggleSearchBtn">
            {{ expand ? '收起查询' : '更多查询' }}
            <Icon v-show="expand" type="ios-arrow-up"/>
            <Icon v-show="!expand" type="ios-arrow-down"/>
          </span>
        <Button class="mr8" type="info" icon="ios-search" @click="searchByParams">搜索</Button>
        <Button type="warning" icon="ios-close-circle" @click="reset('condition')">取消筛选</Button>
      </div>
    </Form>
    <Button class="mr8" type="info" v-if="!showOne" @click="batchRecommendToCityIndex">推荐到城市站首页</Button>
    <Button class="mr8" type="success" @click="batchRecommendToPcXgt">推荐到PC效果图</Button>
    <Button class="mr8" type="info" v-if="showOne" @click="batchRecommendToAppFeed">推荐到信息流</Button>
    <Button class="mr8" type="error" @click="batchCancelRecommendToPcXgt">取消推荐到PC效果图</Button>
    <Button class="mr8" type="error" v-if="showOne" @click="batchCancelRecommendToAppFeed">取消推荐到信息流</Button>
    <Button class="mr8" type="info" v-if="showOne" @click="batchEditiVisible">编辑状态</Button>
    <Button type="success" icon="ios-download-outline" v-on:click="download">导出Excel</Button>
    <div>
      <Table
          style="margin-top: 10px;"
          :data="tableData"
          ref="xgtTable"
          :columns="tableColumns"
          @on-selection-change="setSelected"
      ></Table>

      <div style="margin: 10px;overflow: hidden">
        <div style="float: left;">
          <Page
              :total="total"
              :page-size="condition.perPage"
              :current="condition.page"
              show-total
              show-sizer
              show-elevator
              @on-change="changePage"
              @on-page-size-change="changePageSize"
          ></Page>
        </div>
      </div>
    </div>
    <Modal
        ref="view"
        width="730"
        v-model="previeImgVisible"
        @on-cancel="closeImgModal"
        @on-ok="closeImgModal"
        draggable
        title="图片"
    >
      <img class="previeImg" :src="previeImgurl"/>
    </Modal>
    <Modal
        ref="editVisibleForm"
        width="350"
        v-model="editVisibleFormShow"
        draggable
        title="编辑显示状态"
    >
      <Form ref="editVisibleFormData" :model="editVisibleFormData">
        <Row v-if="previeImgurl">
          <Col>
            <span>图片</span>
          </Col>
          <Col :xs="xs" :sm="sm" :md="md" :lg="lg">
            <div>
              <img width="100px" height="100px" :src="previeImgurl"/>
            </div>
          </Col>
        </Row>
        <FormItem prop="oldaid" label="AID">
          <Input v-model="editVisibleFormData.oldaid" readonly></Input>
        </FormItem>
        <FormItem prop="visible" label="编辑状态">
          <Select v-model="editVisibleFormData.visible">
            <Option
                v-if="item.id != -1 "
                v-for="item in config.visible"
                :value="item.id"
                :key="item.id"
            >
              {{
                item.title
              }}
            </Option>
          </Select>
        </FormItem>
        <!-- <FormItem prop='startTime' label='待显示时间'>
                    <DatePicker type='datetime' v-model='editVisibleFormData.startTime'
                                @on-change="(dateTime) => {  handlerTime(dateTime,'editVisibleFormData') }"></DatePicker>
        </FormItem>-->
      </Form>
      <div slot="footer">
        <Button type="primary" @click="commitVisibleFormData">更新</Button>
        <Button type="default" @click="closeEditVisibleModal">关闭</Button>
      </div>
    </Modal>
  </div>
</template>

<script>
import List from "@/utils/xgt/list";
import Mixin from "@/utils/Mixin";
import HttpClient from "@/utils/http";
import mixinsForm from '@/utils/mixins/form';

export default {
  mixins: [Mixin.msgBoxMixinClass, Mixin.utils, mixinsForm],
  name: "xgtManagerList",
  data() {
    return {
      api: {
        efpListApi: "ias/efp/oms/search",
        efpExportApi: "ias/efp/export"
      },
      // labelWidth: 75,
      total: 0,
      isSearch: false,
      previeImgVisible: false,
      editVisibleFormShow: false,
      previeImgurl: "",
      selectedRows: [],
      tableData: [],
      hiddenStatus: 0,
      visibleStatus: 1,
      waitForVisibleStatus: 2,
      urlStatus: 3,
      unRecommendStatus: 2,
      recommendToAppFeedStatus: 3,
      recommendToPcXgtStatus: 1,
      recommendToCityIndexStatus: 4,
      showOne: 1,
      showOneReadOnly: false,
      editVisibleFormData: {
        oldaid: "",
        startTime: "",
        visible: 0
      },
      condition: {
        source: -1,
        visible: -1,
        spaceTag: -1,
        subSpaceTag: -1,
        comment_app: -1,
        category: -1,
        styleTag: -1,
        showOne: 1,
        startTime: "",
        endTime: "",
        timeType: 1,
        queryType: 1,
        customerValue: "",
        isRepeat: -1,
        page: 1,
        perPage: 40,
        oareaTag: -1,
        houseTag: -1
      },
      config: {
        source: [],
        visible: [],
        zoneid: [],
        spaceTagAll: [],
        comment_app: [],
        category: [],
        styleid: [],
        hxconfig: [],
        partid: [],
        queryType: [],
        timeType: [],
        showOne: [],
        oareaType: [],
        publicZone: [],
        subSpaceTag: []
      },
      xs: {
        span: 1
      },
      sm: {
        span: 2
      },
      md: {
        span: 3
      },
      lg: {
        span: 4
      },
      exportColumns: [
        { key: "pid", title: "图片ID" },
        { key: "oldCid", title: "图片CID" },
        { key: "oldAid", title: "图片AID" },
        { key: "nick", title: "上传者" },
        { key: "editTimeStr", title: "编辑时间" },
        { key: "zoneName", title: "空间" },
        { key: "styleTagName", title: "风格" },
        { key: "hxName", title: "户型" },
        { key: "originalOldaid", title: "第一原创AID" },
        { key: "originalFilename", title: "第一原创图片地址" }
      ],
      tableColumns: [
        {
          type: "selection",
          width: 60,
          align: "center",
          fixed: "left"
        },
        {
          key: "oldCid",
          fixed: "left",
          width: 100,
          title: "CID"
        },
        {
          title: "AID",
          key: "oldAid",
          fixed: "left",
          width: 100
        },
        {
          title: "标题",
          key: "title",
          width: 100,
          tooltip: true
        },
        {
          title: "图片",
          key: "cover",
          fixed: "left",
          width: 110,
          render: (h, params) => {
            let imgUrl = params.row.cover;
            let originImgUrl = params.row.filename;
            return this.renderCoverUrl(h, imgUrl, originImgUrl);
          }
        },
        {
          title: "作者昵称",
          key: "authorName",
          tooltip: true,
          width: 100
        },
        {
          title: "作者uid",
          key: "uid",
          width: 100
        },
        {
          title: "显示状态",
          key: "visible",
          width: 160,
          tooltip: true,
          render: (h, params) => {
            return this.getVisibleStatus(h, params);
          }
        },
        {
          title: "推荐状态",
          key: "commentApp",
          width: 155,
          render: (h, params) => {
            return this.getRecomendStatus(h, params);
          }
        },
        {
          title: "空间",
          key: "spaceTag",
          width: 100,
          tooltip: true,
          render: (h, params) => {
            const id = params.row.zoneId;
            const category = params.row.category;
            if (category !== 2) {
              if (
                params.row.spaceSubTagName !== undefined &&
                params.row.spaceSubTagName !== ""
              ) {
                return this.getTag(
                  id,
                  params.row.spaceTagName + "/" + params.row.spaceSubTagName,
                  h
                );
              } else {
                return this.getTag(id, params.row.spaceTagName, h);
              }
            } else {
              return this.getTag(id, params.row.spaceTagName, h);
            }
          }
        },
        {
          title: "第一原创",
          key: "originalOldaid",
          width: 100,
          tooltip: true
        },
        {
          title: "装修类型",
          key: "category",
          width: 100,
          tooltip: true,
          render: (h, params) => {
            const id = params.row.category;
            return this.getTitle(id, this.config.category, h);
          }
        },
        {
          title: "风格",
          key: "styleTag",
          width: 100,
          tooltip: true,
          render: (h, params) => {
            const id = params.row.styleId;
            return this.getTag(id, params.row.styleTagName, h);
          }
        },
        {
          title: "户型",
          key: "houseTag",
          width: 100,
          tooltip: true,
          render: (h, params) => {
            const id = params.row.hxId;
            return this.getTag(id, params.row.houseTagName, h);
          }
        },
        {
          title: "创建时间",
          key: "sourceCreateTimeStr",
          width: 150
        },
        {
          title: "来源",
          key: "source",
          width: 100,
          tooltip: true,
          render: (h, params) => {
            const id = params.row.source;
            return this.getTitle(id, this.config.source, h);
          }
        },
        {
          title: "图片PID",
          key: "id",
          width: 100
        },
        {
          title: "来源AID",
          key: "sourceOldaid",
          width: 100
        },
        {
          title: "来源CID",
          key: "sourceOldcid",
          width: 100
        },
        {
          title: "操作",
          width: 250,
          key: "commentApp",
          fixed: "right",
          render: (h, params) => {
            return this.buildActions(h, params);
          }
        }
      ]
    };
  },
  methods: {
    getConfig() {
      List.getConfig().then(res => {
        this.config = res.data;
      });
    },
    isShowOne(showOne) {
      return showOne === 1;
    },
    isCover(caseId) {
      return caseId === 0;
    },
    isVisible(status, edittime) {
      if (status === this.hiddenStatus) {
        return false;
      } else if (status === this.waitForVisibleStatus) {
        edittime = Date.parse(edittime);
        let nowtime = new Date().getTime();
        if (edittime < nowtime) {
          return true;
        }

        return false;
      }
      return true;
    },
    getTitle(id, config, h) {
      let title = "未知(" + id + ")";
      if (config) {
        config.forEach(function(item) {
          if (item.id === id) {
            title = item.title;
            return title;
          }
        });
      }
      return h("span", {}, title);
    },
    getTag(id, tag, h) {
      let tagName = "";
      if (tag === "") {
        tagName = "未定义";
      } else {
        tagName = tag;
      }

      return h("span", {}, tagName);
    },
    getXgtList() {
      let params = List.makePageParams(
        this.condition.page,
        this.condition.perPage
      );
      if (this.condition.showOne > -1) {
        params.showOne = this.condition.showOne;
      }
      HttpClient.fetch(this.api.efpListApi, params).then(res => {
        if (!res && !res.data && !res.data.result) {
          return;
        }
        let ret = res.data.result;
        for (let res in ret["rows"]) {
          ret["rows"][res]["originalOldaid"] =
            ret["rows"][res]["originalOldaid"] === 0
              ? ""
              : ret["rows"][res]["originalOldaid"];
        }
        this.tableData = ret.rows;
        this.setShowOne(ret.rows);
        this.total = ret.total;
        if (ret.total === 0) {
          this.$Message.error("无匹配的记录");
        }
      });
    },
    changePage(page) {
      this.condition.page = page;
      this.reflesh();
    },
    changePageSize(pageSize) {
      this.condition.perPage = pageSize;
      this.reflesh();
    },
    searchByParams() {
      this.condition.page = 1;
      this.search();
    },
    checkTime(startTime, endTime) {
      if (startTime && endTime) {
        if (endTime < startTime) {
          this.$Message.error("结束时间需大于开始时间");
          return false;
        }
      }
      return true;
    },
    search() {
      let params = this.checkCondition(this.condition);
      if (!this.checkTime(this.condition.startTime, this.condition.endTime)) {
        return false;
      }
      let condition = Object.assign({}, params);
      if (condition) {
        console.log(JSON.stringify(condition));
        HttpClient.fetch(this.api.efpListApi, condition).then(res => {
          if (!res && !res.data && !res.data.result) {
            return;
          }
          let ret = res.data.result;
          this.setShowOne(ret.rows);
          this.tableData = ret.rows;
          this.total = ret.total;
          this.isSearch = true;
          if (ret.total === 0) {
            this.$Message.error("无匹配的记录");
          }
        });
      }
    },
    checkCondition() {
      let params = {};
      let condition = this.condition;
      Object.keys(condition).forEach(function(key) {
        if (
          condition[key] !== -1 &&
          condition[key] !== "" &&
          condition[key] !== null
        ) {
          params[key] = condition[key];
          if (key === "comment_app") {
            params["commentApp"] = condition[key];
          }
          console.log(key);
          if (key === "startTime" || key === "endTime") {
            console.log(condition[key]);
            params[key] = new Date(condition[key]).getTime() / 1000;
            console.log(condition[key]);
          }
        }
      });
      return params;
    },
    reflesh() {
      if (this.isSearch) {
        this.search();
      } else {
        this.getXgtList();
      }
    },
    renderCoverUrl(h, imgUrl, originImgUrl) {
      return h(
        "img",
        {
          attrs: {
            src: imgUrl,
            "data-img": originImgUrl,
            width: 90,
            height: 90
          },
          on: {
            click: event => {
              this.openImgPreview(event);
            }
          }
        },
        imgUrl
      );
    },
    openImgPreview(event) {
      this.previeImgVisible = true;
      this.previeImgurl = event.target.getAttribute("data-img");
    },
    closeImgModal() {
      this.previeImgVisible = false;
      this.previeImgurl = "";
    },
    getRecomendStatus(h, params) {
      let row = params.row;
      const status = row.commentApp;
      const recommendToCityIndex = row.recommendToCityIndex;
      let text = "未知状态(" + status + ")";
      let children = [];
      if (this.isShowOne(row.showOne)) {
        this.config.comment_app.forEach(function(item) {
          if (item.id === status) {
            text = item.title;
            children.push(
              h(
                "Tag",
                {
                  props: {
                    type: "border"
                  }
                },
                text
              )
            );
            return true;
          }
        });
      }
      if (!this.isShowOne(row.showOne)) {
        if (status === this.recommendToPcXgtStatus) {
          text = "推荐到PC效果图";
          children.push(
            h(
              "Tag",
              {
                props: {
                  type: "border"
                }
              },
              text
            )
          );
        }

        if (recommendToCityIndex === this.recommendToCityIndexStatus) {
          text = "推荐到城市站首页";
          children.push(
            h(
              "Tag",
              {
                props: {
                  type: "border"
                }
              },
              text
            )
          );
        }
        if (!children.length) {
          text = "都不推荐";
          children.push(
            h(
              "Tag",
              {
                props: {
                  type: "border"
                }
              },
              text
            )
          );
        }
      }
      return h("div", {}, children);
    },
    getVisibleStatus(h, params) {
      const status = params.row.visible;
      const msg = status === undefined ? "未定义" : status;
      let text = "未知状态(" + msg + ")";
      this.config.visible.forEach(function(item) {
        if (item.id === status) {
          text = item.title;
        }
      });
      return h(
        "Tag",
        {
          props: {
            type: "border"
          }
        },
        text
      );
    },
    reset(name) {
      this.$refs[name].resetFields();
    },
    setShowOne(data) {
      if (!data) {
        return false;
      }
      let self = this;
      data.forEach(function(item) {
        self.showOne = item.showOne;
        return true;
      });
    },
    buildActions(h, params) {
      const row = params.row;
      let buttonList = [];
      const editFormButton = this.buildEditFormButton(h, params);
      buttonList.push(editFormButton);
      const editVisibleButton = this.buildVisibleButtone(h, row);
      if (editVisibleButton) {
        buttonList.push(editVisibleButton);
      }
      const appFeedButton = this.buildAppFeedButton(h, row);
      if (appFeedButton) {
        buttonList.push(appFeedButton);
      }
      const pcXgtButton = this.buildPcXgtButtone(h, row);
      if (pcXgtButton) {
        buttonList.push(pcXgtButton);
      }
      const indexCityButton = this.buildCityIndexButton(h, row);
      if (indexCityButton) {
        buttonList.push(indexCityButton);
      }
      return h("div", buttonList);
    },
    buildEditFormButton(h, params) {
      let text = "编辑";
      const props = {
        style: {
          color: "#2D8cF0",
          cursor: "pointer"
        },
        on: {
          click: () => {
            this.openDetailForm(params.row, "xgtEdit");
          }
        }
      };
      return h("div", props, text);
    },
    buildVisibleButtone(h, row) {
      if (!this.isShowOne(row.showOne)) {
        return false;
      }
      let text = "编辑显示状态";
      const props = {
        style: {
          cursor: "pointer",
          color: "#2D8cF0"
        },
        on: {
          click: () => {
            this.openEditVisibleForm(row);
          }
        }
      };
      return h("div", props, text);
    },
    buildReommendAppFeedButtone(h, row) {
      if (!this.isVisible(row.visible, row.editTime)) {
        return false;
      }
      let buttonType = "warning";
      let text = "推荐到信息流";
      let method = "recommendToAppFeed";
      let arg = row.oldAid;
      return this.buildButtone(h, method, arg, text, buttonType);
    },
    buildCancelRecommendAppFeedButtone(h, row) {
      let buttonType = "warning";
      let text = "取消推荐到信息流";
      let method = "cancelRecommendToAppFeed";
      let arg = row.oldAid;
      return this.buildButtone(h, method, arg, text, buttonType);
    },
    buildRecommendPcXgtButtone(h, row) {
      if (!this.isVisible(row.visible, row.editTime)) {
        return false;
      }
      let buttonType = "success";
      let text = "推荐到PC效果图";
      let method = "recommendToPcXgt";
      let arg = row.oldAid;
      return this.buildButtone(h, method, arg, text, buttonType);
    },
    buildCancelRecommendPcXgtButtone(h, row) {
      let buttonType = "success";
      let text = "取消推荐到PC效果图";
      let method = "cancelRecommendToPcXgt";
      let arg = row.oldAid;
      return this.buildButtone(h, method, arg, text, buttonType);
    },
    buildRecommendCityIndexButtone(h, row) {
      if (!this.isVisible(row.visible, row.editTime)) {
        return false;
      }
      let buttonType = "success";
      let text = "推荐到城市站首页";
      let method = "recommendToCityIndex";
      let arg = row.oldCid;
      return this.buildButtone(h, method, arg, text, buttonType);
    },
    buildCancelRecommendCityIndexButtone(h, row) {
      let buttonType = "success";
      let text = "取消推荐到城市站首页";
      let method = "cancelRecommendToCityIndex";
      let arg = row.oldCid;
      return this.buildButtone(h, method, arg, text, buttonType);
    },
    buildAppFeedButton(h, row) {
      if (!this.isShowOne(row.showOne)) {
        return false;
      }
      if (row.commentApp === this.recommendToAppFeedStatus) {
        return this.buildCancelRecommendAppFeedButtone(h, row);
      } else {
        return this.buildReommendAppFeedButtone(h, row);
      }
    },
    buildCityIndexButton(h, row) {
      if (this.isShowOne(row.showOne)) {
        return false;
      }
      if (row.recommendToCityIndex === this.recommendToCityIndexStatus) {
        return this.buildCancelRecommendCityIndexButtone(h, row);
      } else {
        return this.buildRecommendCityIndexButtone(h, row);
      }
    },
    buildPcXgtButtone(h, row) {
      if (!this.isShowOne(row.showOne) && !this.isCover(row.caseId)) {
        return false;
      }
      if (row.commentApp === this.recommendToPcXgtStatus) {
        return this.buildCancelRecommendPcXgtButtone(h, row);
      } else {
        return this.buildRecommendPcXgtButtone(h, row);
      }
    },
    buildButtone(h, clickMethod, arg, text, buttonType) {
      const props = {
        style: {
          color: "#2D8cF0",
          cursor: "pointer"
        },
        on: {
          click: () => {
            this.confirm(clickMethod, arg, text);
          }
        }
      };
      return h("div", props, text);
    },
    confirm(method, arg, content) {
      let self = this;
      let config = {
        content: "确认" + content + "?",
        onOk: () => {
          let methods = this.$options.methods;
          methods[method](arg, self);
        }
      };
      this.$Modal.confirm(config);
    },
    handlerRecommendRes(res, msg) {
      if (res.errorCode === 0) {
        msg = msg + "成功";
        this.$Message.info(msg);
        this.reflesh();
      } else {
        msg = msg + "失败";
        this.$Message.error(msg);
      }
    },
    recommendToAppFeed(oldaid, self) {
      List.recommendToAppFeed(oldaid).then(res => {
        self.handlerRecommendRes(res, "推荐到信息流");
      });
    },
    cancelRecommendToAppFeed(oldaid, self) {
      List.cancelRecommendToAppFeed(oldaid).then(res => {
        self.handlerRecommendRes(res, "取消推荐到信息流");
      });
    },
    recommendToPcXgt(oldaid, self) {
      List.recommendToPcXgt(oldaid).then(res => {
        self.handlerRecommendRes(res, "推荐到PC效果图");
      });
    },
    cancelRecommendToPcXgt(pid, self) {
      List.cancelRecommendToPcXgt(pid).then(res => {
        self.handlerRecommendRes(res, "取消推荐到PC效果图");
      });
    },
    recommendToCityIndex(oldCid, self) {
      List.recommendToCityIndex(oldCid).then(res => {
        self.handlerRecommendRes(res, "推荐到城市站首页");
      });
    },
    cancelRecommendToCityIndex(oldCid, self) {
      List.cancelRecommendToCityIndex(oldCid).then(res => {
        self.handlerRecommendRes(res, "取消推荐到城市站首页");
      });
    },
    openEveryDateRecommendUrl() {
      window.open("http://www.to8to.com/trdn/xiaoguotu_app_recommend.php");
    },
    batchRecommendToCityIndex() {
      let oldCidStr = this.getVisibleOldCidStr();
      if (oldCidStr) {
        this.recommendToCityIndex(oldCidStr, this);
      }
    },
    batchRecommendToPcXgt() {
      let oldaidStr = this.getVisibleOldAidStr();
      if (oldaidStr.length) {
        this.recommendToPcXgt(oldaidStr, this);
      }
    },
    batchRecommendToAppFeed() {
      let oldaidStr = this.getVisibleOldAidStr();
      if (oldaidStr.length) {
        this.recommendToAppFeed(oldaidStr, this);
      }
    },
    batchCancelRecommendToAppFeed() {
      let oldaidStr = this.getVisibleOldAidStr();
      if (oldaidStr.length) {
        this.cancelRecommendToAppFeed(oldaidStr, this);
      }
    },
    batchCancelRecommendToPcXgt() {
      let oldaidStr = this.getVisibleOldAidStr();
      if (oldaidStr.length) {
        this.cancelRecommendToPcXgt(oldaidStr, this);
      }
    },
    batchEditiVisible() {
      let oldAidStr = this.getSelectOldAidStr();
      if (!oldAidStr.length) {
        return false;
      }
      let row = {
        oldAid: oldAidStr,
        visible: this.hiddenStatus,
        filename: ""
      };
      this.openEditVisibleForm(row);
    },
    getVisibleOldCidStr() {
      let visibleOldCidArr = this.getVisibleOldCid();
      if (!visibleOldCidArr.length) {
        return "";
      }
      return visibleOldCidArr.join(",");
    },
    getVisibleOldAidStr() {
      let visibleOldAidArr = this.getVisibleOldAid();
      if (!visibleOldAidArr.length) {
        return "";
      }
      return visibleOldAidArr.join(",");
    },
    getVisibleOldCid() {
      let visibleRows = this.getVisibleRows();
      if (!visibleRows.length) {
        return [];
      }
      let visibleOldCid = [];
      visibleRows.forEach(function(item) {
        if (item.oldCid) {
          visibleOldCid.push(item.oldCid);
        }
      });
      return visibleOldCid;
    },
    getVisibleOldAid() {
      let visibleRows = this.getVisibleRows(this.selectedRows);
      if (!visibleRows) {
        return [];
      }
      let filterRows = this.getFilterRowsRows(visibleRows);
      if (!filterRows) {
        this.$Message.error("套图模式下请选择封面图操作");
        return [];
      }
      let visibleOldAid = [];
      visibleRows.forEach(function(item) {
        if (item.oldAid) {
          visibleOldAid.push(item.oldAid);
        }
      });
      return visibleOldAid;
    },
    getFilterRowsRows(visibleRows) {
      let filterRows = [];
      let self = this;
      visibleRows.forEach(function(item) {
        if (self.isShowOne(item.showOne)) {
          filterRows.push(item);
        } else if (self.isCover(item.caseId)) {
          filterRows.push(item);
        }
      });
      return filterRows;
    },
    getVisibleRows() {
      if (!this.checkedBeforeRecommend()) {
        return [];
      }
      let visibleRows = [];
      let self = this;
      this.selectedRows.forEach(function(item) {
        if (self.isVisible(item.visible, item.editTime)) {
          visibleRows.push(item);
        }
      });
      if (!visibleRows.length) {
        this.$Message.error("请选择显示状态行");
        return [];
      }
      return visibleRows;
    },
    getSelectOldAidStr() {
      if (!this.checkedBeforeRecommend()) {
        return [];
      }
      let oldAidArr = [];
      this.selectedRows.forEach(function(item) {
        oldAidArr.push(item.oldAid);
      });
      if (oldAidArr.length) {
        return oldAidArr.join(",");
      } else {
        this.$Message.error("清选择行");
        return [];
      }
    },
    checkedBeforeRecommend() {
      if (!this.selectedRows.length) {
        this.$Message.error("请选择要操作的行");
        return 0;
      }
      return this.selectedRows.length;
    },
    setSelected(selection) {
      this.selectedRows = selection;
    },
    openEditVisibleForm(row) {
      this.editVisibleFormShow = true;
      this.editVisibleFormData.oldaid = row.oldAid;
      this.editVisibleFormData.visible = row.visible;

      if (this.editVisibleFormData.visible === this.waitForVisibleStatus) {
        this.editVisibleFormData.startTime = row.editTime;
      }
      this.previeImgurl = row.filename;
    },
    closeEditVisibleModal() {
      this.editVisibleFormShow = false;
      this.editVisibleFormData.oldaid = 0;
      this.editVisibleFormData.startTime = "";
      this.editVisibleFormData.visible = 0;
      this.previeImgurl = "";
    },
    setWaitVisible() {
      let self = this;
      List.setWaitVisible(this.editVisibleFormData).then(res => {
        self.handlerRecommendRes(res, "设置为待显示状态");
      });
    },
    setVisible() {
      let self = this;
      List.setVisible(this.editVisibleFormData).then(res => {
        self.handlerRecommendRes(res, "设置为显示状态");
      });
    },
    setHiddent() {
      let self = this;
      List.setHiddent(this.editVisibleFormData).then(res => {
        self.handlerRecommendRes(res, "设置为隐藏状态");
      });
    },
    setUrlStatus() {
      let self = this;
      List.setUrlStatus(this.editVisibleFormData).then(res => {
        self.handlerRecommendRes(res, "设置为URL状态");
      });
    },
    commitVisibleFormData() {
      if (!this.editVisibleFormData.oldaid) {
        this.$Message("非法操作");
        return false;
      }
      switch (this.editVisibleFormData.visible) {
        case this.visibleStatus:
          this.setVisible();
          break;
        case this.hiddenStatus:
          this.setHiddent();
          break;
        case this.urlStatus:
          this.setUrlStatus();
          break;
      }
    },
    handlerTime(dateTime, key) {
      switch (key) {
        case "startTime":
          this.condition.startTime = dateTime;
          break;
        case "endTime":
          this.condition.endTime = dateTime;
          break;
        case "editVisibleFormData":
          this.editVisibleFormData.startTime = dateTime;
          break;
      }
    },
    buildQuery(row) {
      let query = {};
      if (this.isShowOne(row.showOne)) {
        query = {
          type: "onepic",
          id: row.oldAid
        };
      } else {
        query = {
          type: "onesuit",
          id: row.oldCid
        };
      }
      return query;
    },
    openDetailForm(row, name = "xgtEdit") {
      let query = this.buildQuery(row);
      this.$router.push({
        name: name,
        query: query
      });
    },
    download() {
      this.showConfirmBox("确认导出数据？", "已取消操作", function(container) {
        container.exportExcel();
      });
    },
    zoneChange(zoneid, category) {
      if (this.condition.zoneid !== -1) {
        this.condition.category = category;

        if (this.condition.category === 1) {
          this.config.subSpaceTag = [];
          for (var i = 0; i < this.config.spaceTagAll.length; i++) {
            if (this.config.spaceTagAll[i][zoneid]) {
              this.config.subSpaceTag = this.config.spaceTagAll[i][zoneid];
            }
          }
        }
      }
    },
    categoryChange(category) {
      this.condition.zoneid = -1;
    },
    // 导出数据
    exportExcel() {
      let params = this.checkCondition(this.condition);
      let arr = Object.keys(params);
      if (arr.length === 0) {
        this.$Message.error("请输入筛选条件后导出");
        return false;
      }
      // let maxNum = 100000
      let condition = Object.assign({}, params);
      console.dir(condition);
      HttpClient.fetch(this.api.efpExportApi, condition).then(res => {
        if (!res && !res.data && !res.data.result) {
          return;
        }
        let data = res.data.result;
        if (data.length > 0) {
          /**
                         if (res.allRows > maxNum) {
                            this.$Message.error('最多导出100000条记录，请调整筛选范围')
                            return false
                        }
                            */
          let fileName = "效果图";
          this.$refs.xgtTable.exportCsv({
            filename: fileName,
            data: data,
            columns: this.exportColumns
          });
        } else {
          this.$Message.error("暂无数据");
          return false;
        }
      });
    }
  },
  watch: {
    "condition.comment_app": function(newVal, oldVal) {
      if (newVal === this.recommendToAppFeedStatus) {
        this.condition.showOne = 1;
        this.showOneReadOnly = true;
      } else if (newVal === this.recommendToCityIndexStatus) {
        this.condition.showOne = 0;
        this.showOneReadOnly = true;
      } else if (newVal === this.unRecommendStatus) {
        this.condition.showOne = 1;
        this.showOneReadOnly = true;
      } else {
        this.condition.showOne = 1;
        this.showOneReadOnly = false;
      }
    }
  },
  mounted() {
    this.getConfig();
    this.getXgtList();
  }
};
</script>
<style lang="less" scoped>
.xgt {
    width: 100%;
}
.form-container {
  display: flex;
  .form-left-block {
      flex: 1;
  }
  .form-right-block {
    text-align: right;
    .toggle-btn {
      cursor: pointer;
      margin-right: 10px;
      color: #3396fb;
      -webkit-user-select: none;
    }
  }
}
.mr8{
    margin-right: 8px;
}
.w162{
    width: 162px;
}

.ivu-modal-center {
  display: flex;
  align-items: center;
  justify-content: center;

  .ivu-modal {
    top: 0;
  }
}
</style>
